<template>
  <view class="content">
    <text style="font-size: 50rpx; font-weight: bold;">子组件B</text>
    <view class="b-box" style="margin: 20rpx 0; padding: 10rpx; background: #f5f5f5;">
      <text>CompA组件传进来的值:</text>
      <text class="intent-text-box" style="font-weight: bold; color: blue; margin-left: 10rpx;">{{ result || '无' }}</text>
    </view>
    <view class="b-box" style="margin: 20rpx 0; display: flex; align-items: center;">
      <text>回传值:</text>
      <input 
        type="text" 
        v-model="callbackValue" 
        style="color: yellow; border: 1px solid #eee; padding: 10rpx; margin: 0 10rpx; flex: 1;" 
        placeholder="请输入回传值"
      />
      <button @click="sendOutside()" size="mini" type="warn">回传</button>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      result: '',
      callbackValue: ''
    }
  },
  created() {
    uni.$on('getIntent', (msg) => {
      console.error("----ComB----getIntent----->" + msg);
      this.result = msg;
    });
  },
  methods: {
    sendOutside() {
      console.warn("----ComB----sendOutside------>" + this.callbackValue);
      this.$emit('callBackFun', this.callbackValue);
    }
  }
}
</script>

<style scoped>
.content {
  background: #fff;
  padding: 20rpx;
  border-radius: 10rpx;
  box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.1);
}
</style>